/**
 * @author lulongwen
 * Date: 2023-08-27 17:01
 * Description: 鼠标追随选中的节点
 */
import { NodeToolbar, useStore } from 'reactflow';

const selectedNodesSelector = (state) =>
  Array.from(state.nodeInternals.values())
    .filter((node) => node.selected)
    .map((node) => node.id);

export default function MultiSelectionToolbar() {
  const selectedNodeIds = useStore(selectedNodesSelector);
  const isVisible = selectedNodeIds.length > 0;

  return (
    <NodeToolbar nodeId={selectedNodeIds} isVisible={isVisible}>
      <button>鼠标追随选中的节点</button>
    </NodeToolbar>
  );
}
